<template>
  <ant-modal modalWidth="800" modalHeight="600" :visible="open" :modal-title="formTitle" :adjust-size="true" :maskClosable="false"
    @cancel="cancel">
    <a-form-model ref="form" :model="form" :rules="rules" slot="content" layout="vertical">
      <a-row :gutter="32">
        <a-col :span="12">
          <a-form-model-item label="售后单号">
            <a-input v-model="form.saleOrderCode" readOnly v-if="form.id"/>
            <a-input v-model="form.saleOrderCode" placeholder="售后单号自动生成" v-else/>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="售后日期">
            <a-date-picker
              v-model="form.saleOrderDate"
              valueFormat="YYYY-MM-DD"
              :show-today="true"
              placeholder="选择日期"
              style="width: 100%"
               />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="关联销售单" prop="orderNumber">
            <a-input v-model="form.orderNumber" readOnly v-if="form.id"/>
            <a-input-search v-model="form.orderNumber" placeholder="请选择关联销售单" v-else readOnly @click="onSearchLinkNumber"
              @search="onSearchLinkNumber"
            />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="客户">
            <a-input v-model="form.customerName" readOnly />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="客户地址">
            <a-input v-model="form.address" readOnly />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="业主电话">
            <a-input v-model="form.phone" readOnly />
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="收费金额" prop="feedAmount">
            <a-input  v-model="form.feedAmount" readOnly v-if="form.id"/>
            <a-input type='number' v-model="form.feedAmount" placeholder="请输入收费金额" v-else/>
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="12">
          <a-form-model-item label="客户反馈照片">
            <a-upload
              :headers="headers"
              :file-list="fileList"
              list-type="picture-card"
              :customRequest="handleChange"
              :remove='handleRemove'
            >
              上传
            </a-upload>
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="问题描述" prop="remark">
            <a-textarea v-model="form.remark" placeholder="请输入问题描述" :rows="4"/>
          </a-form-model-item>
        </a-col>
      </a-row>
      <BizOrderSelect ref="BizOrderSelect" @ok="selectOk"></BizOrderSelect>
    </a-form-model>
    <template slot="footer">
      <a-button :disabled="disabled" @click="cancel">
        取消
      </a-button>
      <a-button type="danger" :disabled="disabled" @click="remove" v-if='form.status==0'>
        删除
      </a-button>
      <a-button type="primary" :disabled="disabled" @click="submitForm(true)" v-if='form.status==0 || !form.status'>
        保存
      </a-button>
    </template>
  </ant-modal>
</template>
<script>
import BizPurchaseForm from './BizAfterSaleOrderForm'
export default {
  ...BizPurchaseForm
}
</script>
<style lang="less" scoped>
.table-operations,
body tr.ant-table-expanded-row:hover .table-operations {
  padding-bottom: 8px;
  text-align: right;
}

.table-operations {
  margin-bottom: 16px;
}

.table-operations>button,
.table-operations .ant-input-affix-wrapper {
  margin-right: 8px;
}

.table_title {
  float: left;
  padding-left: 8px;
  font-weight: 600;
  color: #222222;
  line-height: 30px;
}
</style>
